$bodyMagin: #{(20/24)}rem;
$colorBorder: #f0f0f0;

.fnlist {
    padding: #{(100/24)}rem 0;

    .fntop {
        img {
            //width: #{(430/24)}rem;
        }
        //border-bottom: 1px solid $colorBorder;
    }

    .fnintro {
        margin-top: #{(10/24)}rem;
        //border-top: #{(28/24)}rem solid $colorBorder;
        font-size: #{(28/24)}rem;
        color: #333;

        .item {
            background-color: #fff;
            padding: $bodyMagin;
            margin-bottom: #{(10/24)}rem;
            font-size: #{(24/24)}rem;

            p {
                font-size: #{(28/24)}rem;
            }

            .tip {
                padding: #{(16/24)}rem 0;
            }
        }

        s {
            font-size: #{(24/24)}rem;
            padding-left: 1rem;
        }

        .c-red {
            color: #ff626d;
        }

        p {
            padding: 0.1rem 0;
        }
    }

    .buybtn {
        display: inline-block;
        float: right;
        color: #fff;
        background-color: #c30c22;
        line-height: #{(100/24)}rem;
        font-size: #{(30/24)}rem;
        padding-left: #{(55/24)}rem;
        padding-right: #{(55/24)}rem;
    }

    .sltview {
        float: left;
        color: #333;
        font-size: #{(28/24)}rem;
        line-height: #{(100/24)}rem;
        margin-left: #{(20/24)}rem;
        padding-left: #{(38/24)}rem;
        background: url('../Img/card/slt.png') no-repeat left center;
        background-size: #{(32/24)}rem;

        span {
            color: #c30c22;
        }

        i {
            font-style: normal;
        }
    }

    #cardlist {
        p {
            color: #333;
            font-size: #{(28/24)}rem;
            margin-bottom: #{(10/24)}rem;

            &.br {
                border: 1px solid #ddd;
                border-radius: #{(8/24)}rem;
                padding-left: #{(64/24)}rem;
                padding-right: #{(20/24)}rem;
                background: #f8f8f8 url('../Img/card/slt2.png') no-repeat left 0.83333rem center;
                background-size: #{(28/24)}rem;
                line-height: #{(34/24)}rem;
                padding-top: #{(12/24)}rem;
                padding-bottom: #{(12/24)}rem;
                box-sizing: border-box;
            }

            &.song {
                border: 0;
                background-color: #fff;
                background-image: url('../Img/card/song.png');
                background-size: #{(38/24)}rem;
                background-position: left 0.7rem center;
                // border-top-left-radius: #{(40/24)}rem;
                // border-bottom-left-radius: #{(40/24)}rem;
                // white-space: nowrap;
                // background-position: left-1px;
            }

            // &.song1 {
            //      @extend .song;
            //     // border-top-left-radius: #{(80/24)}rem;
            //     // border-bottom-left-radius: #{(80/24)}rem;
            //     // padding-left: #{(140/24)}rem;
            //     // white-space: normal;
            // }
        }
    }

    .slttip {
        font-size: #{(24/24)}rem!important;
    }

    .packagetitle {
        background-color: #fff;
        //padding-bottom: #{(20/24)}rem;

        h5 {
            font-size: #{(28/24)}rem;
            color: #333;
            line-height: 1;
            padding: #{(20/24)}rem;
            font-weight: normal;
        }

        .sltlist {
            text-align: center;
            padding: 0 3vw;

            li {
                font-size: #{(28/24)}rem;
                display: inline-block;
                color: #333;
                margin-right: #{(20/24)}rem;
                margin-bottom: #{(20/24)}rem;
                padding: 0 #{(30/24)}rem;
                line-height: #{(60/24)}rem;
                float: left;
                border-radius: #{(60/24/2)}rem;
                box-sizing: border-box;
                background-color: #f8f8f8;

                &:last-child {
                    margin-right: 0;
                }

                &.active {
                    color: #fff;
                    background-color: #c30c22;
                }
            }
        }
    }
}

#headerstatic {
    position: static;
    border-bottom: 0;
}
